import { ref } from 'vue'
import debounce from '@/utils/debounce'

function useModel(props, emit) {
  const inputValue = ref(props.modelValue)

  function notify(newValue) {
    emit('update:modelValue', newValue.target.value.trim())
  }

  function clear() {
    inputValue.value = ''
    emit('update:modelValue', '')
  }

  return {
    inputValue,
    clear,
    inputCb: debounce(notify)
  }
}

export default useModel
